@import "function.scss";
$mainColor:#DC1136;//主题色

/*通用设置*/
body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
html,body{min-height:100%;width:100%;min-width:1200px;font-size:14px;color:#333;font-family: "microsoft yahei";background:#f2f2f2;}
a{text-decoration:none;}
img{border: none;}
ul,li{list-style:none}
select{height:30px; vertical-align:top\9;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}

select,input,textarea{font-family:"microsoft yahei"; outline: none;box-sizing: border-box;resize:none;}
table{border-collapse:collapse;border-spacing:0}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset; 
}

@font-face {font-family: "iconfont";
    src: url('font/iconfont.eot'); /* IE9*/
    src: url('font/iconfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('font/iconfont.woff') format('woff'), /* chrome, firefox */
    url('font/iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
    url('font/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
}

.iconfont {
    font-family:"iconfont" !important;
    font-size:16px;
    font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
}


/*常用*/
.pub-l{float:left;}
.pub-r{float:right;}
.pub-tl{text-align: left;}
.pub-tr{text-align: right;}
.pub-main{width:1200px;margin:0 auto;position:relative;}
.pub-clear{ clear:both; height:1px; overflow:hidden;}
.pub-clear2{overflow: hidden;}
.pub-borderbox{box-sizing:border-box;-moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.pub-textellipsis{overflow:hidden;white-space: nowrap;text-overflow: ellipsis;}/*单排多出显示省略号*/
.pub-wordspcing{word-spacing:-0.25em;}
.pub-red{color:$mainColor;}
.pub-bold{font-weight:bold;} 
.pub-center{text-align:center;}
.pub-middle{vertical-align:middle !important;}
.pub-speed{transform: translateZ(0);-webkit-transform: translateZ(0);}



/*字号*/
.pub-font12{font-size:12px;}
.pub-font14{font-size:14px;}
.pub-font16{font-size:16px;}
 
/*过渡样式*/
.pub-transition, .pub-transition *{ -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.pub-notransition, .pub-notransition *{-webkit-transition: none; transition: none; }


@-moz-document url-prefix(){
    .pub-wordspcing{word-spacing:-0.25em;}
}


/*上传图片*/
.pub-upimg{
  width: 110px;height: 110px; display: inline-block; position: relative; background:center center no-repeat url();border:1px solid #d7d7d7; margin-right:3px;
  input{position:absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; opacity: 0.01; filter: alpha(opacity=1);}
  img,div{position: absolute;left: 0; top: 0; z-index: 1; width: 110px;height: 110px;}
  .del{position: absolute; right: 5px; top: 5px; z-index: 3; width:20px;height:20px; background:$mainColor; color: #fff; display: none; text-align: center; line-height: 20px; border-radius: 50%; font-size: 12px; cursor: pointer;}
  .progress{width:100%;position: absolute;left: 0;bottom:0;background:rgba(255,255,255,0.2);text-align: center;font-size:14px;color:#333;height:30px;line-height:30px;z-index: 1;display: none;}
}
.pub-upimg:hover .del{display: block;}
.pub-upimg.disabled .del{display:none !important;}
.pub-upimg.new .del{ display: none !important;}
.pub-upimg.nobg{background:none !important;}



/*按钮*/
.pub-btn{min-width:50px;height:30px; padding:0 15px; font-size: 14px; line-height: 30px; border-radius: 2px; background: $mainColor; color: #fff;display: inline-block; text-align: center;  cursor: pointer; vertical-align: top; box-sizing: border-box; border:none; transition: all 0.2s linear;}
.pub-btn:hover{background:#e51c2c;}
.pub-btn-gray,.pub-btn-white{background:#e5e5e5; border:1px solid #cecece; color: #666;}
.pub-btn-white{background:#fff;}
.pub-btn-gray:hover,.pub-btn-white:hover{background:#fff;border-color:$mainColor;color: $mainColor;}
.pub-btn.disabled{background:#eee !important; border:1px solid #cecece; color: #aaa;}


.pub-btn-icon{
    display: inline-block;border:solid 1px #e0e0e0;min-width: 60px; height: 30px; background: #fff;color: #545454;padding:0 5px;line-height: 30px;@include transition;
    span{ vertical-align: middle;}
 }
 .pub-btn-icon:hover{background-color:#f2f2f2;}




/*下拉列表*/
.pub-ui-select,.pub-ui-select li,.pub-ui-select ul{list-style: none; padding:0;height: 30px; line-height: 32px;background:#fff; margin: 0;box-sizing: border-box;}
.pub-ui-select{width:100px; border:none !important; position: relative;z-index:10;display:inline-block;_display:inline;_zoom:1;}
.pub-ui-select .head{color:#999; border-radius: 2px; position: relative; cursor: default;box-sizing: border-box;}
.pub-ui-select ._icon{width:0; height:0;position:absolute;right:10px; top:50%; margin-top:-3px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid #EB6859;}
.pub-ui-select.disabled .head{background-color:#f7f7f7;}
.pub-ui-select .head,.pub-ui-select .son{border:solid 1px #d7d7d7;}
.pub-ui-select ul{height:auto;}
.pub-ui-select li{color:#999; padding: 0 10px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;font-size: 14px; }
.pub-ui-select li.son{border-top:none;position:absolute;left:0;padding:0;width:100%; height:auto; max-height:215px; display:none; overflow:auto; }
.pub-ui-select ul li:hover{background:#eee;cursor:pointer;}
.pub-ui-select ul li.selected{background:#ddd;}



/*单选项*/
.pub-ui-radio{width:20px; height: 20px; box-sizing: border-box;border:solid 1px #d7d7d7;background:#fff; border-radius: 50%; position: relative; display: inline-block;}
.pub-ui-radio span{width:40%;height:40%;position: absolute; top:30%; left: 30%; background: #333; border-radius: 50%; display: none;}


/*复选框*/
.pub-ui-checkbox{width:20px; height:20px; box-sizing: border-box;border:solid 1px #d7d7d7;background:#fff; position: relative; display: inline-block; text-align: center; height: 20px;}
.pub-ui-checkbox div{width: 100%; height: 100%; overflow: hidden;}
.pub-ui-checkbox img{width:100%; height: 100%; position: absolute; left: 0; top: 0;}


/*开关式复选框*/
.pub-ui-onoff{width:100px;height:30px; box-sizing: border-box; color: #fff; background:#EB6859; border-radius: 20px; text-align: right;transition:all 0.2s linear;-webkit-transition:all 0.2s linear; font-size:14px;line-height: 30px; position: relative; display: inline-block;}
.pub-ui-onoff label{width:50%; text-align: center; display:inline-block; height: 100%;}
.pub-ui-onoff span{width:55%; height: 100%; position: absolute; cursor: pointer; font-weight: bold;  background:#fff; left:0; top: 0;border-radius:15px; box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.2);transition:all 0.15s linear;-webkit-transition:all 0.15s linear;color:#444;text-align: center;}


/*对话框*/
.pub-alert{position:fixed; left:0; top:0; display:none;z-index:998;width:100%;height: 100%;}
.pub-alert-content{width:650px; min-height:100px;background: #FFFFFF;box-shadow: 0px 5px 8.46px 0.54px rgba(131, 131, 131, 0.7);border-radius: 2px;border:solid 1px #ccc; position: absolute; left: 0; top: 0; z-index: 2;}
.pub-alert .pub-alert-title{padding:5px 10px; position:relative;cursor:default; background: $mainColor;}
.pub-alert .pub-alert-title div{font-size: 18px;color: #fff; text-align: center; font-weight: bold; }
.pub-alert .pub-alert-title span{background-position:-144px 0; cursor: pointer; position:absolute; right: 10px; top: 7px;}
.pub-alert .bottom{padding:15px;text-align: center;}
.pub-alert .bottom a.pub-btn{margin:0 5px;background:$mainColor;min-width:100px; height: 33px; line-height: 33px;}
.pub-alert .bottom a.pub-btn2{background: #e5e5e5;}
.pub-alert .content{padding: 20px 20px 0 20px; overflow: auto;}
.pub-alert .pub-alert-bg{position:absolute; z-index: 1; width: 100%; height: 100%; background:#fff; opacity: 0.5; filter: alpha(opacity=50); left: 0; top:0;}

.pub-alert-tip .pub-alert-content{width:450px;}
.pub-alert-tip .content{
    padding: 30px 20px 10px 20px;
    div{
        text-align: center; font-size:16px;word-wrap:break-word;
        .pub-icon36{vertical-align: middle;margin-right:5px;}
    }
}



/*数字加减*/
.pub-num{width:100px; display: inline-block;*display:inline;height:30px; border-radius: 2px; overflow: hidden; position: relative;text-align: center; }
.pub-num span{position:absolute;width:30px; height: 30px; background: #EB6859; color:#fff; line-height: 28px; font-size:24px;cursor:pointer;display: inline-block;*display:inline; top: 0; }
.pub-num span:hover{background:#e51c2c}
.pub-num.disabled span,.pub-num2.disabled span{background:#c2c2c2;cursor: default;}
.pub-num .plus{right:0;}
.pub-num .reduce{left:0;}
.pub-num input.text{ position:absolute;left:30px;top:0;border:none;height:30px; line-height: 28px\9;width:40px; font-size:16px; border:solid 1px #ccc;border-left:none; border-right:none; text-align:center; box-sizing: border-box; padding-left: 0;}

.pub-num2{width:54px; height: 40px; border:solid 1px #999;overflow: hidden;border-radius: 2px;display: inline-block;}
.pub-num2 span{border:solid 1px #999; border-top:none;border-right:none; float:right;width:20px; height: 21px; text-align: center; font-size: 22px; line-height: 18px;cursor:pointer; box-sizing: border-box;}
.pub-num2 input.text{width:32px; height: 40px; line-height: 40px\9; border:none; float:left; text-align: center;font-size:16px; padding-left: 0;}
.pub-num2 span:hover{background:#eee}


/*时间输入框*/
.pub-date{cursor:default;background:no-repeat center right url(); }

/*输入框*/
input.text,textarea.text{border:solid 1px #dcdcdc;height:30px;line-height:30px\9;padding-left: 5px; border-radius: 2px;}
textarea.text{height:auto;}



/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar{width:5px;height:5px;background-color:#f2f2f2;}

/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color:#999;
}









//标题
.pub-title{padding-bottom:5px;font-size:16px;color:#666;font-weight:bold;}
.pub-title1{background:#eee;font-size:16px; font-weight:bold;padding:5px 5px 5px 10px;color:$mainColor;margin-bottom:20px;}

//字段项
.pub-item{
    margin-bottom:15px;color:#333;line-height:30px;min-height:30px;position:relative; z-index:1;border-bottom: dashed 1px #ddd; padding-bottom: 10px;
   .field-name{width:70px;display:inline-block;text-align:right; margin-right: 8px;}
   .field-name.no-colon:after{content: "";}
    .field-name.required:before{content: "* ";color:red;}
    .field-name:after{content: ":";position:absolute;}
    .field-name-w80{width:80px;}
    .field-name-w90{width:90px;}
    .field-name-w100{width:100px;}
    .field-name-w110{width:110px;}
    .field-name-w120{width:120px;}
    textarea.text{vertical-align: top; width:500px; height:100px;}
   .field-value{display:inline-block;width:800px; vertical-align:top;}
}
.pub-item-button{
    margin:20px 0 20px 0;border: none;
    .field-name:after{content: "";}
}

.pub-label{margin-right:20px;}



/*选项卡*/
$bordercolor1:#e0e0e0;
.pub-tab{
    margin:10px 15px 0 0;overflow: hidden;
    li{overflow:hidden; float:left;}
    /*.option-list{border-left:solid 1px $bordercolor1;}*/
    .option{width:105px;float:left;height:35px;line-height:35px; text-align: center;color: #878686; position: relative; left: -1px; margin-right:-1px;}
    .option.on{color:$mainColor;background: #fff;border-bottom:solid 1px $mainColor;}
    .tab-block-list{width:100%;margin-top: -1px;background:#fff;padding:25px 15px 20px 15px; box-sizing: border-box;}
    .tab-block{padding-top:25px; display: none;}
}



.pub-alert2{
  .pub-alert-content{width:650px}
  .title{height:20px;border-left:solid 4px $mainColor;padding-left:10px;color:#4a4a4a;font-size:16px;margin-bottom:20px}
  .title2{padding:0 0 20px 0; margin-bottom:20px;border-bottom:solid 1px #eee;}
  .item{width:210px;margin-bottom:25px;color:#333;float:left;line-height:30px;height:30px;position:relative; z-index:1;}
  .fieldname,.fieldname60,.fieldname85,.fieldname95{width:70px;display:inline-block;text-align:justify;text-justify:distribute-all-lines;text-align-last:justify;}
  .fieldname:after,.fieldname60:after,.fieldname85:after,.fieldname95:after{content:"";display: inline-block;　width: 100%;overflow:hidden;}
  .fieldname60{width: 60px;}
  .fieldname85{width:85px;}
  .fieldname95{width: 95px;}
}



//表格样式
.pub-table{
    width: 100%;background:#fff;font-size:15px; color: #666;text-align: center; table-layout: fixed;
    th{height:30px; background:#fff;border-bottom:solid 1px #ddd;}
    td{border:none; height: 45px;white-space: nowrap;text-overflow: ellipsis; overflow:hidden;border-left:solid 1px #ddd;border-bottom:solid 1px #ddd; text-align: center !important;padding:0 5px;}
    td:first-child{border-left:none;}
    .btn{min-width:60px; margin: 0 3px;}
    tr:hover{background:#f8f8f8;}
    .icon-show,.icon-close,.icon-hide{background-position:-48px 0;vertical-align:middle;cursor:pointer;}
    .icon-close{background-position:-336px 0;}
    .icon-hide{visibility:hidden;}
    tr.last td{border: none;}
    .first-span{padding-left:20px;}
    .sed-span{margin-left:30px;padding-left:25px;background:no-repeat url()}

}


/*分页*/
.pub-paging{
    text-align:center; margin-top:20px;word-spacing:-0.25em;
    a,.a{display: inline-block;border:solid 1px #e4e4e4; width:36px; height: 36px; line-height:36px;color:#666;text-align: center; margin:0 3px;}
    .selected{color:$mainColor !important;}
    .a:hover, .btn:hover{color:$mainColor;}
    .btn{color:#666;}
    .prev,.next{width:72px !important;}
}

.pub-edit-area{background:#fff;margin:5px 15px 0 0;padding:15px;box-sizing: border-box;width:1000px;}


.head-tip{
    margin: 0 0 10px 0;
    .label{
        margin-right:20px; color: #333; font-size:16px;
        .num{margin-left: 5px;}
    }
}


/* 权限列表 */
.permission-field,.permission-list2{display:inline-block;width:120px;vertical-align:top;}
.permission-list2{
  width:670px;
  .permission-field{margin-right:10px;height:30px;}
}
